<template>
	<view class="personList_con">
		<view v-if="addRecord == 0">
			<view class="top_con">
				<view class="title">创建医生档案</view>
				<view class="remark">
					<image src="/static/images/title_icon.png"></image>
					档案信息严格保密，仅您自己可见</view>
			</view>
			<view class="userInfo_con">
				<view class="guid">
					<view class="left">
						<span>*</span>姓名
					</view>
					<view class="input">
						<u-input border="surround"	type="number" v-model="form.doctorName"	:border="false"></u-input>
					</view>
				</view>
				<view class="guid">
					<view class="left">
						<span>*</span>身份证号
					</view>
					<view class="input">
						<u-input border="surround"	type="idcard" 
								v-model="form.idNo" 
								:border="false"
								@blur="validateIdCardInput"
								maxlength="18"
								placeholder="请输入身份证号码">
						</u-input>
					</view>
				</view>
				<view class="guid">
					<view class="left">
						<span>*</span>手机号
					</view>
					<view class="input">
						<u-input border="surround"	type="number" 
								v-model="form.phone" 
								:border="false"
								@blur="validatePhoneInput"
								maxlength="11"
								placeholder="请输入手机号码">
						</u-input>
					</view>
				</view>
				<view class="down_con">
					<view class="left">
						<span>*</span>医师资格证
					</view>
					<view class="upload">
						<u-upload
						    :fileList="fileList1"
						    @afterRead="afterRead"
						    @delete="deletePic"
						    name="1"
						    multiple
						    :maxCount="10"
						  ></u-upload>
					</view>
				</view>
				<view class="down_con">
					<view class="left">
						<span>*</span>执业证
					</view>
					<view class="upload">
						<u-upload
						    :fileList="fileList2"
						    @afterRead="afterRead2"
						    @delete="deletePic2"
						    name="1"
						    multiple
						    :maxCount="10"
						  ></u-upload>
					</view>
				</view>
			</view>
			<view class="btn_con">
				<span @click="submitClick">提交档案</span>
			</view>
		</view>
		<!-- 已提交 -->
		<view v-else>
				<u-no-network
					@disconnected="disconnected"
					@connected="connected"
					@retry="retry"
				></u-no-network>
				<view class="u-content">
					<view class="u-content__circle">
						<u-icon
							name="checkbox-mark"
							color="#fff"
							size="30"
						></u-icon>
					</view>
					<text class="u-content__normal">已提交，审核中...</text>
				</view>
		</view>
	</view>
</template>

<script>
import { doctorAdd,searchDoctorRecord } from '@/api/consultation'
import { validateIdCard } from '@/utils/idCardValidator.js'
	export default{
		data(){
			return{
				form:{
					mobile:uni.getStorageSync('userPhone'), //小程序用户手机号
					doctorName:"",//医生姓名
					idNo:"",//医生身份证号
					phone:"",//医生手机号
					qualificationCert:"https://img.yzcdn.cn/vant/user-avatar.png",//医生资格证
					practiceCert:"https://img.yzcdn.cn/vant/user-avatar.png", //执业证
				},
				fileList1: [],
				fileList2: [],
				addRecord:0
			}
		},
		onShow() {
			this.getDoctorFun()
		},
		methods: {
			// 查询是否医生
			async getDoctorFun(){
				let params = {mobile:this.form.mobile}
				let res = await searchDoctorRecord(params)
				console.log(res)
				this.addRecord = res.data.addRecord   //0未提交  1.已提交
			},
			// 删除图片
			deletePic(event) {
			  this[`fileList${event.name}`].splice(event.index, 1);
			},
			deletePic2(event) {
			  this[`fileList${event.name}`].splice(event.index, 1);
			},
			// 新增图片
			afterRead(event) {
			  // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
			  let lists = [].concat(event.file);
			  let fileListLen = this[`fileList${event.name}`].length;
			  lists.map((item) => {
			    this[`fileList${event.name}`].push({
			      ...item,
			      status: "uploading",
			      message: "上传中",
			    });
			  });
			  for (let i = 0; i < lists.length; i++) {
			    const result = this.uploadFilePromise(lists[i].url);
			    let item = this[`fileList${event.name}`][fileListLen];
			    this[`fileList${event.name}`].splice(
			      fileListLen,
			      1,
			      Object.assign(item, {
			        status: "success",
			        message: "",
			        url: result,
			      })
			    );
			    fileListLen++;
			  }
			},
			afterRead2(event) {
			  // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
			  let lists = [].concat(event.file);
			  let fileListLen = this[`fileList${event.name}`].length;
			  lists.map((item) => {
			    this[`fileList${event.name}`].push({
			      ...item,
			      status: "uploading",
			      message: "上传中",
			    });
			  });
			  for (let i = 0; i < lists.length; i++) {
			    const result = this.uploadFilePromise2(lists[i].url);
			    let item = this[`fileList${event.name}`][fileListLen];
			    this[`fileList${event.name}`].splice(
			      fileListLen,
			      1,
			      Object.assign(item, {
			        status: "success",
			        message: "",
			        url: result,
			      })
			    );
			    fileListLen++;
			  }
			},
			uploadFilePromise(url) {
			  return new Promise((resolve, reject) => {
			    let a = uni.uploadFile({
			      url: "http://192.168.2.21:7001/upload", // 仅为示例，非真实的接口地址
			      filePath: url,
			      name: "file",
			      formData: {
			        user: "test",
			      },
			      success: (res) => {
			        setTimeout(() => {
			          resolve(res.data.data);
			        }, 1000);
			      },
			    });
			  });
			},
			uploadFilePromise2(url) {
			  return new Promise((resolve, reject) => {
			    let a = uni.uploadFile({
			      url: "http://192.168.2.21:7001/upload", // 仅为示例，非真实的接口地址
			      filePath: url,
			      name: "file",
			      formData: {
			        user: "test",
			      },
			      success: (res) => {
			        setTimeout(() => {
			          resolve(res.data.data);
			        }, 1000);
			      },
			    });
			  });
			},
			// 身份证输入验证
			validateIdCardInput() {
				if (this.form.idNo && this.form.idNo.length > 0) {
					const result = validateIdCard(this.form.idNo);
					if (!result.valid && this.form.idNo.length >= 15) {
						uni.showToast({
							title: result.message,
							icon: 'none',
							duration: 2000
						});
					}
				}
			},
			// 手机号输入验证
			validatePhoneInput() {
				if (this.form.phone && this.form.phone.length > 0) {
					const phoneRegex = /^1[3-9]\d{9}$/;
					if (!phoneRegex.test(this.form.phone) && this.form.phone.length === 11) {
						uni.showToast({
							title: '请输入正确的手机号格式',
							icon: 'none',
							duration: 2000
						});
					}
				}
			},
			// 提交档案
			async submitClick(){
				if(!this.form.doctorName){
					uni.showToast({
						title:"请输入医师姓名",
						icon:"none"
					})
					return
				}
				if(!this.form.idNo){
					uni.showToast({
						title:"请输入医师身份证号",
						icon:"none"
					})
					return
				}
				
				// 身份证格式验证
				const idCardResult = validateIdCard(this.form.idNo);
				if(!idCardResult.valid){
					uni.showToast({
						title: idCardResult.message,
						icon:"none"
					})
					return
				}
				
				if(!this.form.phone){
					uni.showToast({
						title:"请输入医师手机号",
						icon:"none"
					})
					return
				}
				
				// 手机号格式验证
				const phoneRegex = /^1[3-9]\d{9}$/;
				if(!phoneRegex.test(this.form.phone)){
					uni.showToast({
						title:"请输入正确的手机号格式",
						icon:"none"
					})
					return
				}
				
				console.log('身份证验证通过:', idCardResult);
				console.log('身份证信息:', idCardResult.info);
				
				console.log('11111111111')
				console.log(this.fileList1)
				console.log(this.fileList2)
				console.log('发送到发发生')
				// if(!this.fileList1.length){
				// 	uni.showToast({
				// 		title:"请上传医师资格证",
				// 		icon:"none"
				// 	})
				// 	return
				// }
				// if(!this.fileList2.length){
				// 	uni.showToast({
				// 		title:"请上传执业证",
				// 		icon:"none"
				// 	})
				// 	return
				// }
				
				let params = {
					...this.form,
					// docQualification:this.fileList1[0].url,
					// docLicense:this.fileList2[0].url,
				}
				let res = await doctorAdd(params)
				if(res.code === 200){
					uni.showToast({
						title:"提交成功",
						icon:"none"
					})
					uni.navigateBack({
						delta: 1
					})
				}else{
					uni.showToast({
						title:res.msg,
						icon:"none"
					})
					return
				}
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	.personList_con{
		width:100%;
		height:100%;
		background: #F8F8F8;
		padding: 22rpx 29rpx;
		font-family: PingFang SC, PingFang SC;
		.top_con{
			margin-bottom: 30rpx;
			padding: 10rpx 0;
			.title{
				font-weight: 600;
				font-size: 32rpx;
				color: #000000;
				margin-bottom: 9rpx;
			}
			.remark{
				display: flex;
				align-items: center;
				font-weight: 400;
				font-size: 26rpx;
				color: #999999;
				image{
					width:26rpx;
					height:31rpx;
					margin-right: 12rpx;
				}
				
			}
		}
		.userInfo_con{
			background: #FFFFFF;
			border-radius: 6rpx;
			margin-bottom: 19rpx;
			padding: 25rpx 31rpx;
			.guid{
				padding: 20rpx 0;
				border-bottom: 1rpx solid #E4E4E4;
				display: flex;
				align-items: center;
				.left{
					display: flex;
					font-weight: 400;
					font-size: 30rpx;
					color: #000000;
					width:200rpx;
					span{
						color:#7D2527;
					}
				}
				.input{
					flex: 1;
				}
			}
			.down_con{
				padding: 29rpx 0;
				border-bottom: 1rpx solid #E4E4E4;
				.left{
					display: flex;
					font-weight: 400;
					font-size: 30rpx;
					color: #000000;
					width:200rpx;
					margin-bottom: 18rpx;
					span{
						color:#7D2527;
					}
				}
				.upload{
					margin-bottom: 21rpx;
				}
				.text{
					font-weight: 400;
					font-size: 30rpx;
					color: #999999;
					margin-bottom: 10rpx;
				}
				.export{
					font-weight: 400;
					font-size: 30rpx;
					color: #7D2527;
				}
			}
		}
		.btn_con{
			position: fixed;
			bottom: 40rpx;
			padding: 0 29rpx;
			width:100%;
			left: 0;
			span{
				display: inline-block;
				width:100%;
				background: #7D2527;
				border-radius: 50rpx;
				height:80rpx;
				line-height: 80rpx;
				text-align: center;
				font-size: 32rpx;
				color:#fff;
			}
		}
		
	}
	
	.u-content {
			padding: 150px 60px 0;
			height:100%;
			align-items: center;
			justify-content: center;
			text-align:center;
			&__circle {
				background-color: green;
				border-radius: 100px;
				width: 60px;
				height: 60px;
				margin: 0 auto;
				display: flex;
				align-items: center;
				justify-content: center;
			}
	
			&__normal {
				font-size: 15px;
				color: red;
				margin-top: 15px;
			}
		}
</style>